<template>
  <div id="app">
    <header>
      <div><img src="../../../assets/images/exclamation.png" alt=""></div>
      <h1 class="baseColor">预付款功能使用条件</h1>
      <p class="baseColor">请完善以下资料才可使用预付款功能</p>
    </header>
    <div class="orderBtn">
      <router-link to="/" class="active">返回主页 <i class="active"></i></router-link>
      <router-link to="/advanceVerify">查看订单<i>></i></router-link>
      <router-link to="/advanceVerify">会员等级<i>></i></router-link>
    </div>
    <footer>
      <router-link to="/paymentResult">开始下单</router-link>
    </footer>
  </div>
</template>

<script>
  export default {
    name: "advance-verify"
  }
</script>

<style lang="less" scoped>
  #app {
    header {
      div {
        width: 3.328rem;
        height: 3.328rem;
        border-radius: 50%;
        margin: 2.5rem auto 1rem;
      }
      h1 {
        text-align: center;
        font-size: 0.725rem;
      }
      p {
        text-align: center;
        font-size: 0.554rem;
        margin: 0.3rem 0 1rem;
      }
    }
    .orderBtn {
      padding: 1rem 0.5rem 0.5rem;
      .mint-button--default {
        box-shadow: none;
      }
      a {
        display: block;
        line-height: 1.87rem;
        font-size: 0.597rem;
        border-radius: 5px;
        text-align: center;
        margin-bottom: 0.7rem;
        position: relative;
        background: #f6f6f6;
        color: #000;
        &.active {
          background: #ffefd9;
          color: #ff9500;
        }
        i {
          float: right;
          position: absolute;
          right: 1.5rem;
          top: 0.45rem;
          width: 0.85rem;
          height: 0.85rem;
          line-height: 0.85rem;
          font-size: 0.8rem;
          font-family: simsun;
          font-weight: bold;
          &.active {
            border-radius: 50%;
            background: url("../../../assets/images/check-icon.png");
            background-size: 100%;
          }
        }
      }
    }
    footer {
      position: fixed;
      width: 100%;
      bottom: 0;
      background: #ff9500;
      line-height: 2.176rem;
      text-align: center;
      max-width: 750px;
      a {
        color: #fff;
        font-size: 0.597rem;
        display: block;
      }
    }
  }
</style>
